import { HTMLAttributes } from "react";
import { twMerge } from "tailwind-merge";

function Key(props: HTMLAttributes<HTMLDivElement>) {
    const { className, children, ...otherProps } = props;

    return (
        <div className={twMerge('size-14 bg-neutral-300 inline-flex justify-center items-center text-xl text-neutral-950 font-medium rounded-2xl', className)} {...otherProps}>
            {children}
        </div>
    );
}

export default Key;